<template>
	<view class="flex align-center py-2">
		<block v-for="(item,index) in tarbarList" :key="index">
			<view class="flex-1 flex align-center justify-center" @click="onTabClick(item,index)">
				<text class="font-weight-bold " :class="tabIndex===index ? 'text-main font-lg':'text-dark font-md'">{{item}}</text>
			</view>
		</block>
	</view>
</template>
<script>
	export default {
		props: {
			tarbarList: {
				type: Array,
				default: []
			},
		},
		data() {
			return {
				tabIndex:0,
			}
		},
		methods:{
			onTabClick(item,index) {
				this.tabIndex = index;
				this.$emit('onTabClick',item,index)
			}
		}
	}
</script>
<style lang="scss">
	
</style>